<template>
  <el-select v-model="value" :placeholder="props.placeholder" clearable :disabled="props.disabled">
    <el-option
      v-for="item in list"
      :key="item[props.valueKey]"
      :label="item[props.labelKey]"
      :value="item[props.valueKey]"
    />
  </el-select>
</template>

<script setup>
import { getCommonData } from "@/api/project/common.js";
const value = defineModel();
const dataList = ref([]);
const props = defineProps({
  dataList: Array,
  placeholder: {
    type: String,
    default: "",
  },
  valueKey: {
    type: String,
    default: "id",
  },
  labelKey: {
    type: String,
    default: "name",
  },
  isFetch: {
    type: Boolean,
    default: true,
  },
  disabled: {
    type: Boolean,
    default: false,
  },
  paramsName: String,
});
const list = computed(() => {
  return props.isFetch ? dataList.value : props.dataList;
});
//获取数据
const getDataList = async () => {
  const params = {
    bizName: props.paramsName,
  };
  try {
    const res = await getCommonData(params);
    dataList.value = res.data;
  } catch (error) {
    console.log(error);
  }
};
onMounted(() => {
  props.isFetch && getDataList();
});
</script>

<style scoped lang="scss"></style>
